import $ from 'jquery';

export function renderAbout() {
  return `
    <div class="page about-page">
      <h1>关于我们</h1>
      <div class="about-content">
        <div class="about-image">
          <div class="placeholder-image">jQuery SPA</div>
        </div>
        <div class="about-text">
          <p>这是一个演示项目，展示如何使用 jQuery 和 Webpack 构建单页面应用程序。</p>
          <p>尽管现代前端开发已经转向 React、Vue 和 Angular 等框架，但 jQuery 仍然是一个强大且易于使用的库，特别适合小型项目和快速原型开发。</p>
          <p>本项目展示了如何将 jQuery 与现代前端工具（如 Webpack）结合使用，创建具有路由功能的单页面应用程序。</p>
        </div>
      </div>
      <div class="team">
        <h2>我们的团队</h2>
        <div class="team-members">
          <div class="member">
            <div class="member-avatar">JQ</div>
            <h3>jQuery 专家</h3>
            <p>前端开发者</p>
          </div>
          <div class="member">
            <div class="member-avatar">WP</div>
            <h3>Webpack 工程师</h3>
            <p>构建工具专家</p>
          </div>
          <div class="member">
            <div class="member-avatar">SP</div>
            <h3>SPA 架构师</h3>
            <p>应用架构设计</p>
          </div>
        </div>
      </div>
    </div>
  `;
}